<template>
  <view class="">
    <view class="box" :style="'height:' + winHeight + 'px'">
      <view class="content-image">
        <!-- <image src="../../static/images/welcome-image.png" alt=""></image> -->
      </view>
    </view>
    <button class="weixinLogin" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
      <view>
        手机号快捷登录
      </view>
    </button>
  </view>
</template>

<script>
export default {
  onShow() {
    uni.switchTab({
      // url: '/pages/login/index'
	   url: '/pages/tabbar/home/index'
    })
  },
  methods: {

  }

}
</script>


<style lang='less'>
.box {
  display: flex;
  justify-content: center;
  align-items: center;
}

.content-image,
.content-image::before,
.content-image::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.content-image {
  width: 200px;
  height: 200px;
  margin: auto;
  color: #69ca62;
  box-shadow: inset 0 0 0 1px #B4E4B0;
  border-radius: 10rpx;
}

.content-image::before,
.content-image::after {
  content: '';
  z-index: -1;
  margin: -5%;
  box-shadow: inset 0 0 0 2px;
  animation: clipMe 8s linear infinite;
  border-radius: 10rpx
}

.content-image::before {
  animation-delay: -4s;
}

@keyframes clipMe {

  0%,
  100% {
    clip: rect(0px, 220.0px, 2px, 0px);
  }

  25% {
    clip: rect(0px, 2px, 220.0px, 0px);
  }

  50% {
    clip: rect(218.0px, 220.0px, 220.0px, 0px);
  }

  75% {
    clip: rect(0px, 220.0px, 220.0px, 218.0px);
  }
}
</style>